import React from 'react'
import { Area } from 'react-vant'
import { areaList } from '@vant/area-data'
import { useNavigate } from 'react-router-dom';
import { hooks } from 'react-vant'
import { useLocation } from 'react-router-dom';


export default function Cityselect(props) {
    let Navigate = useNavigate()
    let Location = useLocation()
    const [state, updateState] = hooks.useSetState({
        city: {},
    })
    let city = (val, options) => {
        if (options.length >= 2) {
            updateState({
                city: options[1]
            })
        }

    }

    let nav = () => {
        if (Location.state.num == 1) {
            Navigate('/addall', { state: state.city })

        } else if (Location.state.num == 2) {
            Navigate('/addcell', { state: state.city })

            // 
        }
    }
    return (
        <div>
            <Area
                title='地区选择'
                areaList={areaList}
                columnsNum={2}
                onChange={(val, options) => {
                    city(val, options)
                }}
                onConfirm={v => { nav() }}
                itemHeight={80}
            />
        </div>
    )
}
